<template>
	<view>
		<cu-custom class="" bgColor="bgmains" :isBack="true">
		    <view slot="content">分销收益</view>
		</cu-custom>
		
		<view class="margin box padding">
			<view class="date">今日</view>
			<view class="flex">
				<view>累计收益</view>
				<view>累计订单</view>
				<view>新增下线</view>
			</view>
			<view class="flex num">
				<view>{{data.today_money}}</view>
				<view>{{data.today_order}}</view>
				<view>{{data.today_count}}</view>
			</view>
		</view>
		
		<view class="margin box padding">
			<view class="date">昨日</view>
			<view class="flex">
				<view>累计收益</view>
				<view>累计订单</view>
				<view>新增下线</view>
			</view>
			<view class="flex num">
				<view>{{data.yesterday_money}}</view>
				<view>{{data.yesterday_order}}</view>
				<view>{{data.yesterday_count}}</view>
			</view>
		</view>
		
		<view class="margin box padding">
			<view class="date">本月</view>
			<view class="flex">
				<view>累计收益</view>
				<view>累计订单</view>
				<view>新增下线</view>
			</view>
			<view class="flex num">
				<view>{{data.month_money}}</view>
				<view>{{data.month_order}}</view>
				<view>{{data.month_count}}</view>
			</view>
		</view>
		
		<view class="margin box padding">
			<view class="date">今年</view>
			<view class="flex">
				<view>累计收益</view>
				<view>累计订单</view>
				<view>新增下线</view>
			</view>
			<view class="flex num">
				<view>{{data.year_money}}</view>
				<view>{{data.year_order}}</view>
				<view>{{data.year_count}}</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	var app = getApp()
	export default{
		data(){
			return{
				data:{}
			}
		},
		onLoad() {
			this.getData()
		},
		methods:{
			getData() {
				const self = this;
				app.globalData.util.request({
					url: 'Distribution/incomeStatistics',
					data: {},
					success(res) {
						self.data = res.data.data
						console.log(res.data.data)
					}
				}, true);
			}
		}
	}
</script>

<style lang="scss">
	.bgmains{
		background-color: white !important;
	}
	.box{
		background-color: white;
		border-radius: 10rpx;
		.date{
			color: #121212;
			font-size: 30rpx;
			font-weight: bold;
			margin-bottom: 10rpx;
		}
		.flex{
			view{
				margin-top: 10rpx;
				width: 33%;
				color: #121212;
				opacity: 0.7;
				font-size: 22rpx;
			}
		}
		.num{
			view{
				color: #121212;
				opacity: 1 !important;
				font-size: 34rpx !important;
				font-weight: bold;
			}
		}
	}
</style>